Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Switching to a SVG presentation attribute to assist Microsoft browsers #1723

Merged
merged 1 commit into from
May 26, 2017

Conversation

monfera
Copy link
Contributor

@monfera monfera commented May 24, 2017

There is still insufficient support for CSS styles on SVG elements in IE: plotly/plotly.R#1023 (comment)

@@ -444,11 +444,11 @@ module.exports = function(svg, styledData, layout, callbacks) {
.append('g')
.classed('sankeyLinks', true)
.style('fill', 'none')
.style('transform', linksTransform);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good catch.

Would anyone be interested in making @alexcjohnson 's strict-d3 wrapper throw an error on selection.style('transform', <>)?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Good idea! I'm working on it now in a separate PR.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

We need to check if the styled element is an SVG element or not. (I'm planning to just check the first element in the selection with sel.node() as selecting both HTML and SVG elements in the same selection is not commonly done.) A linting problem arises:

/Users/robert/repos/plotly/plotly.js/test/image/strict-d3.js
  42:38  error  'SVGElement' is not defined  no-undef

Interestingly the linter doesn't balk on a similar usage.

Have we got an established workaround, or should I just lint-define the SVGElement locally?

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't think we have an established workaround, either lint defining it or var SVGElement = window.SVGElement would be fine by me.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

var SVGElement = window.SVGElement

Yep, that's the way to go here 👍

@monfera
Copy link
Contributor Author

monfera commented May 25, 2017

The tweening effect when switching between horizontal and vertical layout was a bit like a circus attraction, and interestingly, the switch to attr made it noticeably worse, crossing into creepy territory. I'm reworking a chunk of code so that links and nodes don't "fly" on separate arcs but they remain joint instead. It also stops the node rectangle shape morphing too. As I think this PR stands on its legs though (fixing the error) it'll be a separate PR based on this one.

@alexcjohnson
Copy link
Collaborator

The tweening effect when switching between horizontal and vertical layout was a bit like a circus attraction, and interestingly, the switch to attr made it noticeably worse

Interesting indeed... I certainly wouldn't have expected that to make a difference.

Personally I don't see animating an orientation change as being particularly useful to viewers (did we have an explicit requirement to do this?), so I'd be at least as happy just snapping to the new layout - particularly if it's going to take a noticeable effort to fix this.

@alexcjohnson
Copy link
Collaborator

This looks to be all set yes? Particularly since #1729 is merged so it's tested...
💃

@monfera monfera merged commit 0904db3 into master May 26, 2017
@monfera monfera deleted the sankey-transform-attr branch May 26, 2017 05:02
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants